.bazipaipan {
  .margins {
    margin: 0 auto;
    max-width: 1500px;
    padding: 0 80px 30px 80px;

    .navigation {
      height: 40px;
      line-height: 40px;
      margin-top: -10px;
      background-color: #f9f9f9;
    }

    .prediction {
      float: right;
      margin-top: -30px;

      .spacing {
        margin-right: 20px;
      }
    }

    .divider {
      margin: -24px 0 -10px 0;
    }

    .reLoading-button {
      width: 120px;
    }

    /* 其他默认数据 */
    .default-other {
      min-height: 550px;
      // border-radius: 20px;
      // border: 1px rgb(206, 242, 255) solid;
      // box-shadow: 0 0 5px 0 rgba(206, 242, 255);
      background-color: rgba(255, 255, 255, 0);

      .header {
        text-align: center;
        font-size: 20px;
        margin: -20px 0 10px 0;
        font-family: 楷体, serif;
      }

      div {
        // height: 22px;
        line-height: 30px;
        border-bottom: 1px rgb(245, 245, 245) solid;
      }

      .null {
        color: rgb(150, 150, 150);
      }

      .title {
        font-size: 13px;
        float: left;
        color: rgb(100, 100, 100);
        font-weight: bold;
      }

      .more {
        border: none;
        text-align: center;
        margin-top: 10px;

        .button {
          cursor: pointer;
          transition: .3s;
        }

        .button:hover {
          // text-decoration: underline; // 下划线
          color: rgb(45, 140, 242);
          transition: .3s;
        }
      }

    }

    /* 默认排盘数据 */
    .default {
      min-height: 550px;
      background-color: rgba(255, 255, 255, 0);
      border: none;

      .top {
        color: white;
        height: 50px;
        margin-top: -20px;
        background-color: rgb(50, 50, 50);
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        // border: 1px solid rgba(0, 225, 255, 0.5);

        .left {
          float: left;

          .date {
            padding: 5px 0 0 20px;
          }
        }

        .right {
          float: right;

          .sheng-xiao {
            cursor: pointer;
            padding: 5px;
            font-size: 22px;
            line-height: 50px;
            color: rgb(207, 175, 76);
            border: 2px solid rgb(207, 175, 76);
            border-radius: 50px;
            margin-right: 20PX;
            font-family: 楷体, serif;
            animation: sheng-xiao 3s infinite;
            text-shadow: 0 0 2px 2px rgba(207, 175, 76, 0.5);
            box-shadow: 0 0 2px 2px rgba(207, 175, 76, 0.5);
          }

          @keyframes sheng-xiao {
            0% {
              opacity: 1;
            }

            50% {
              color: rgb(255, 255, 255);
              border: 2px solid white;
              text-shadow: 0 0 2px 2px rgba(150, 150, 150, 0.5);
              box-shadow: 0 0 2px 2px rgba(150, 150, 150, 0.5);
            }

            100% {
              opacity: 1;
            }
          }
        }
      }

      .bottom {
        // color: rgb(50, 50, 50);
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;

        .title {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(140, 140, 140) !important;
          font-size: 14px !important;
        }

        .title2 {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(150, 150, 150) !important;
          font-size: 14px !important;
          line-height: 56px;
        }

        .title3 {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(150, 150, 150) !important;
          font-size: 14px !important;
          line-height: 54px;
        }

        .go1 {
          height: 30px;
          line-height: 30px;
          border-radius: 20px 20px 0 0;
          background-color: rgb(253, 253, 253);

          div {
            width: 21%;
            float: left;
            color: rgb(140, 140, 140);
            text-align: center;
          }
        }

        .go2 {
          height: 30px;
          line-height: 30px;
          text-align: center;
          background-color: rgb(245, 245, 245);

          div {
            width: 21%;
            float: left;
          }
        }

        .go3 {
          height: 63px;
          line-height: 19px;
          text-align: center;
          background-color: rgb(253, 253, 253);

          div {
            width: 21%;
            float: left;
          }
        }

        .go4 {
          height: 59px;
          line-height: 18px;
          text-align: center;
          background-color: rgb(245, 245, 245);

          div {
            width: 21%;
            float: left;
          }
        }

        .mark {
          cursor: default;
        }

        .zhuxing {}

        .tiangan {
          font-size: 22px;

          .wuxing {
            font-size: 15px;
            margin-left: 2px;
          }
        }

        .dizhi {
          font-size: 22px;
          line-height: 26px;

          .wuxing {
            font-size: 15px;
            margin-left: 2px;
          }
        }

        .canggan {
          font-size: 14px;
          padding-top: 2px;
        }

        .fuxing {
          padding-top: 3px;
        }

        .dishi {
          div {
            color: rgb(48, 49, 51);
          }
        }

        .kongwnag {}

        .nayin {
          div {
            color: rgb(48, 49, 51);
          }
        }

        .shensha {
          text-align: center;
          padding-top: 2px;

          div {
            width: 21%;
            float: left;
            color: rgb(152, 139, 44);
          }
        }
      }
    }

    /* 选项 */
    .option {
      min-height: 550px;
      // border-radius: 10px;

      div {
        margin-bottom: 15px;
      }

      .name {
        width: 75%;
        margin-right: 10px;
      }

      .sex {
        width: 20px;
      }

      .occupy {
        width: 75%;
        margin-right: 10px;
      }

      .leap-month {}

      .date {
        margin-top: 30px;

        .date-type {
          float: right;
        }
      }

      .address {
        float: right;

        .city {
          width: auto;
        }
      }

      .qi-yun {
        margin-top: 30px;

        .default-mark {
          float: right;
          color: #8492a6;
          font-size: 12px;
          margin-right: -15px;
        }

        .title {
          float: left;
          margin-top: 5px;
        }

        .liupai {
          float: left;
          width: 60%;
        }

        .tip {
          margin: 8px 0 0 10px;
        }
      }

      .res {
        padding-top: 40px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;

        .resetting {
          float: left;
          cursor: pointer;
          transition: 0.1s;
        }

        .resetting:focus {
          border-radius: 10px;
          color: rgb(10, 10, 10);
        }

        .resetting:hover {
          transition: 0.1s;
          border-radius: 10px;
          color: rgb(100, 100, 100);
        }

        .resetting:active {
          border-radius: 10px;
          color: black;
        }

        .senior {
          float: right;
          cursor: pointer;
          transition: 0.1s;
        }

        .senior:focus {
          border-radius: 10px;
          color: rgb(10, 10, 10);
        }

        .senior:hover {
          transition: 0.1s;
          border-radius: 10px;
          color: rgb(100, 100, 100);
        }

        .senior:active {
          border-radius: 10px;
          color: black;
        }
      }

      .starts {
        width: 100%;
        height: 50px;
        color: rgb(96, 98, 102);
        border: 1px rgb(150, 150, 150) solid;
        // background-color: rgb(30, 30, 30);
        border-radius: 50px;
        font-size: 16px;
        margin-top: 50px;
        background-color: rgb(253, 253, 253);
      }

      .starts:focus {
        color: rgb(96, 98, 102);
        background-color: rgb(249, 249, 249);
      }

      .starts:hover {
        color: rgb(96, 98, 102);
        background-color: rgb(249, 249, 249);
      }

      .starts:active {
        color: rgb(96, 98, 102);
        background-color: rgb(249, 249, 249);
      }

    }

    /* 返回排盘 */
    .return {
      height: 30px;
      line-height: 30px;
      border: 1px rgb(220, 223, 230) solid;
      width: 100%;
      border-radius: 50px;
      text-align: center;
      background-color: rgb(255, 255, 255);
      font-size: 15px;
      cursor: pointer;
      transition: .4s;
      margin: 0 auto 10px;
    }

    .return:hover {
      // text-align: center;
      // margin: 0 auto 10px;
      // width: 10%;
      transition: .4s;
      border: 1px rgb(210, 210, 210) solid;
      background-color: rgb(251, 251, 251);
    }

    /* 表格 */
    .table {
      min-height: 550px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 20px;

      .top {
        color: white;
        height: 50px;
        // margin-top: -20px;
        background-color: rgb(50, 50, 50);
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        // border: 1px solid rgba(0, 225, 255, 0.5);

        .left {
          float: left;

          .date {
            padding: 5px 0 0 20px;
          }
        }

        .right {
          float: right;

          .ganzhiyinyang {
            zoom: 0.9;
            padding: 13px 20px 0 0;
          }

        }
      }

      .bottom {
        // color: rgb(50, 50, 50);
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;

        .title {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(140, 140, 140) !important;
          font-size: 14px !important;
        }

        .title2 {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(150, 150, 150) !important;
          font-size: 14px !important;
          line-height: 56px;
        }

        .title3 {
          cursor: default;
          width: 15% !important;
          text-align: center;
          color: rgb(150, 150, 150) !important;
          font-size: 14px !important;
          line-height: 54px;
        }

        .go1 {
          height: 30px;
          line-height: 30px;
          border-radius: 20px 20px 0 0;
          background-color: rgb(253, 253, 253);

          div {
            width: 21%;
            float: left;
            color: rgb(140, 140, 140);
            text-align: center;
          }
        }

        .go2 {
          height: 30px;
          line-height: 30px;
          text-align: center;
          background-color: rgb(245, 245, 245);

          div {
            width: 21%;
            float: left;
          }
        }

        .go3 {
          height: 63px;
          line-height: 19px;
          text-align: center;
          background-color: rgb(253, 253, 253);

          div {
            width: 21%;
            float: left;
          }
        }

        .go4 {
          height: 59px;
          line-height: 18px;
          text-align: center;
          background-color: rgb(245, 245, 245);

          div {
            width: 21%;
            float: left;
          }
        }

        .mark {
          cursor: default;
        }

        .zhuxing {}

        .tiangan {
          font-size: 22px;

          .wuxing {
            font-size: 15px;
            margin-left: 2px;
          }
        }

        .dizhi {
          font-size: 22px;
          line-height: 26px;

          .wuxing {
            font-size: 15px;
            margin-left: 2px;
          }
        }

        .canggan {
          font-size: 14px;
          padding-top: 2px;
        }

        .fuxing {
          padding-top: 3px;
        }

        .dishi {
          div {
            color: rgb(48, 49, 51);
          }
        }

        .kongwnag {}

        .nayin {
          div {
            color: rgb(48, 49, 51);
          }
        }

        .shensha {
          text-align: center;
          padding-top: 2px;

          div {
            width: 21%;
            float: left;
            color: rgb(152, 139, 44);
          }
        }
      }
    }

    /* 大运流年 */
    .yunnian {
      // text-align: center;
      min-height: 550px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 20px;

      .shiShen1 {
        width: 24px !important;
        height: 34px !important;
        line-height: 14px !important;
        float: left !important;
        padding: 0 0 0 10px;
        font-size: 15px;
        /* background-color: rgba(255, 255, 255, 0) !important; */
        font-family: 楷体, serif;
        border: none !important;
      }

      .shiShen2 {
        width: 24.4px !important;
        height: 34px !important;
        line-height: 14px !important;
        float: left !important;
        padding: 0 7px 0 0;
        font-size: 15px;
        /* background-color: rgba(255, 255, 255, 0) !important; */
        font-family: 楷体, serif;
        border: none !important;
      }

      .shiShen3 {
        width: 18px !important;
        height: 20px !important;
        line-height: 13px !important;
        float: left !important;
        padding: 0 0 0 3px;
        font-size: 15px;
        background-color: rgba(255, 255, 255, 0) !important;
        font-family: 楷体, serif;
        border: none !important;
      }

      .dayun {
        cursor: pointer;

        div {
          width: 50px;
          font-size: 14px;
          float: left;
          height: 98px;
          text-align: center;
          border: 1px #e6e6e6 solid;
          border-radius: 1px;
        }

        .title {
          cursor: default;
          width: 35px;
          color: #969696;
          font-size: 15px;
          height: 98px;
          line-height: 100px;
          -webkit-touch-callout: none;
          -webkit-user-select: none;
          -khtml-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }

        div .div-yes {
          width: 50px;
          height: 21px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          background-color: #e6e6e6;
          border: none;
        }

        div .div-no {
          width: 50px;
          height: 21px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          border: none;
        }
      }

      .liunian {
        cursor: pointer;
        padding-top: 120px;

        .title {
          cursor: default;
          width: 35px;
          color: #969696;
          font-size: 15px;
          height: 98px;
          line-height: 100px;
          -webkit-touch-callout: none;
          -webkit-user-select: none;
          -khtml-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }

        div {
          width: 50px;
          font-size: 14px;
          float: left;
          height: 98px;
          text-align: center;
          border: 1px #e6e6e6 solid;
        }

        div .div-yes {
          width: 50px;
          height: 21px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          background-color: #e6e6e6;
          border: none;
        }

        div .div-no {
          width: 50px;
          height: 21px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          border: none;
        }
      }

      .xiaoyun {
        cursor: pointer;
        padding-top: 110px;

        .title {
          cursor: default;
          width: 35px;
          color: #969696;
          font-size: 15px;
          height: 58px;
          line-height: 58px;
          -webkit-touch-callout: none;
          -webkit-user-select: none;
          -khtml-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }

        div {
          width: 50px;
          font-size: 14px;
          float: left;
          height: 58px;
          text-align: center;
          border: 1px #e6e6e6 solid;
        }

        div .div-yes {
          width: 50px;
          height: 23px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          background-color: #e6e6e6;
          border: none;
        }

        div .div-no {
          width: 50px;
          height: 23px;
          line-height: 25px;
          text-align: center;
          color: black;
          cursor: pointer;
          border: none;
        }
      }

      .liuyue {
        padding-top: 80px;

        .title {
          cursor: default;
          width: 35px;
          color: #969696;
          font-size: 15px;
          height: 77px;
          line-height: 77px;
          -webkit-touch-callout: none;
          -webkit-user-select: none;
          -khtml-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }

        div {
          width: 41.6px;
          font-size: 14px;
          float: left;
          height: 77px;
          text-align: center;
          border: 1px #e6e6e6 solid;

        }

        div .div {
          height: 23px;
          line-height: 22px;
          text-align: center;
          color: black;
          border: none;
        }
      }

      .illustrate {
        padding-top: 130px;
        color: rgb(150, 150, 150);
      }
    }

    /* 五行旺衰 */
    .wangshuai {
      margin: 20px 0 20px 0;
      border-radius: 50px;
      background-color: rgb(253, 253, 253);
      height: 35px;

      div {
        width: 100%;
        text-align: center;

        .average {
          float: left;
          width: 20%;
          font-size: 15px;
          font-weight: bold;
          margin-top: -14px;
        }
      }
    }

    /* 干支留意 */
    .ganzhiliuyi {
      margin: 20px 0 20px 0;
      border-radius: 50px;
      background-color: rgb(253, 253, 253);
      height: 59px;

      .title {
        font-weight: bold
      }

      .null {
        color: rgb(150, 150, 150);
      }

      .top {
        margin-top: -10px;
      }

      div {
        line-height: 15px;
      }
    }

    /* 基础信息 */
    .foundation {
      min-height: 420px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 20px;

      .go1 {
        height: 25px;
        line-height: 25px;
        background-color: rgb(253, 253, 253);
        border-radius: 5px;

        .title {
          float: left;
          margin: 0 15px 0 10px;
          color: rgb(140, 140, 140);
        }
      }

      .go2 {
        height: 25px;
        line-height: 25px;
        background-color: rgb(245, 245, 245);
        border-radius: 5px;

        .title {
          float: left;
          margin: 0 15px 0 10px;
          color: rgb(140, 140, 140);
        }
      }

    }

    /* 财运、桃花 */
    .caihua {
      min-height: 420px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 20px;

      .jianju {
        float: left;
        width: 150px;
        margin-right: 15px;
      }
    }

    /* 其他信息 */
    .other {
      min-height: 420px;
      background-color: rgba(255, 255, 255, 0);
      border-radius: 20px;

      .guzhong {
        color: #ba7f18;
      }
    }

    /* 星宿 */
    .xingxiu {
      margin: 20px 0 20px 0;
      background-color: rgba(255, 255, 255);
      border-radius: 20px;

      .spacing {
        margin: -15px 0 -15px 0;
      }

      div {
        line-height: 20px;
      }

      .interpret {
        font-family: 楷体, serif;
      }
    }

    /* 命卦 */
    .minggua {
      margin: 20px 0 20px 0;
      background-color: rgba(255, 255, 255);
      border-radius: 20px;

      .spacing {
        margin: -15px 0 -15px 0;
      }

      div {
        line-height: 20px;
      }

      .interpret {
        font-family: 楷体, serif;
      }
    }

    /* 大运运势 */
    .dayunshi {
      margin: 20px 0 20px 0;
      background-color: rgba(255, 255, 255, 0.5);

      .divider {
        margin: -28px 0 10px 0;
      }

      .jianju {
        float: left;
        width: 380px;
      }
    }

    /* 流年运势 */
    .liunianshi {
      background-color: rgba(255, 255, 255, 0.5);

      .divider {
        margin: -28px 0 10px 0;
      }

      .jianju {
        float: left;
        width: 380px;
      }
    }
  }

  /* 高级选项弹窗 */
  .senior-dialog {
    border-radius: 26px;

    .header-senior {
      font-size: 18px;
      color: rgb(70, 70, 70);
    }

    .senior-card {
      border-radius: 20px;
      margin-bottom: 10px;
      background-color: rgb(253, 253, 253);
    }

    .senior-card div {
      padding-bottom: 3px;
    }

    .senior-card .t-senior {
      text-align: center;
      margin: 0 auto;
      margin: -15px 0 4px 0;
      font-size: 12px;
      color: rgb(150, 150, 150);
    }

    .tip {
      margin-left: 10px;
    }

  }

  /* 四柱转日期弹窗 */
  .sizhu-dialog {
    border-radius: 26px;

    .header-sizhu {
      font-size: 18px;
      color: rgb(70, 70, 70);
    }

    .sizhu-card {
      border-radius: 20px;
    }

    .sizhu-card div {
      padding-bottom: 3px;
    }

    .sizhu-card div .year-input {
      width: 25%;
      margin-bottom: 10px;
    }

    .sizhu-res {
      margin-left: 5px;
      font-size: 13px;
    }

    .sizhu-card .count {
      text-align: center;
      color: #ababab;
      margin: 6px 0 -20px 0;
      font-size: 12px;
    }
  }

}